.pageBg{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background: linear-gradient(to right, #000, #333,#000);
  .searchBody{
    display: flex;
    justify-content: center;
    .bigBg{
      position:absolute;
      top:3vh;
      height:65vh;
      width:68vw;
    }
    .searchContent{
      .avatar{
        border-radius:48rpx;
        width:96rpx;
        height:96rpx;
        position:absolute;
        top:18vh;
        left:50%;
        transform: translate(-50%);
      }
    }
  }
  .share-box {
		position: absolute;
    // margin: 0 auto 0;
    left:50%;
    transform: translate(-50%);
    bottom:0rpx;
		display: flex;
		align-items: center;
		flex-direction: column;
		justify-content: space-evenly;
		width: 640rpx;
		height: 340rpx;
		background-color: #fff;
		box-shadow: 0px 5rpx 84rpx 0px rgba(0, 0, 0, 0.75);
		border-radius: 8rpx;
		z-index: 10;
		.text {
			display: flex;
			align-items: center;
			flex-direction: column;
			.title {
				color: #333333;
				font-size: 40rpx;
				margin-bottom: 12rpx;
			}
			.info {
				color: #666666;
				font-size: 26rpx;
			}
		}
		.button-box {
			width: 100%;
			display: flex;
			justify-content: space-evenly;
			.button {
				padding: 0;
				margin: 0;
				background-color: #fff;
				border: none;
				line-height: normal;
				&::after {
					border: none;
			 	}
				.icon {
					width: 80rpx;
					height: 80rpx;
				}
				.text {
					color: #666666;
					font-size: 26rpx;
				}
			}
		}
	}
	.canvasSamll{
		height:60vh;
		width:70%;
		z-index:100;
		position:absolute;
		left:50%;
		top:3vh;
		transform: translate(-50%);
	}
	.canvasBig{
		height:300vh;
		width:300%;
		// z-index:100;
		position:absolute;
		left:50%;
		top:-100000rpx;
		background: #fff;
		transform: translate(-50%);
	}
}


